<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title></title>
	<link rel="stylesheet" type="text/css" href="/static/menu/css/reset.css" />
	<link rel="stylesheet" type="text/css" href="/static/menu/css/default.css">
	<link rel='stylesheet' href='/static/font-awesome-4.7.0/css/font-awesome.min.css'>
	<link rel="stylesheet" type="text/css" href="/static/menu/css/styles.css">
    <link rel="shortcut icon" href="#"/>
	<!--[if IE]>
{#		<script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>#}
	<![endif]-->
    <style>
        span{
            text-align: center;
            width: 100%
        }
    </style>

</head>
<body>
	<div id="top-bar" class="top-bar">
		  <div class="bar">
		    <button id="navbox-trigger" class="navbox-trigger"><i class="fa fa-lg fa-th"></i></button>
              <strong><span style="color: white">{{ project_name }}</span></strong>
              <strong><span style="color: white">{{ project_state }}</span></strong>
              <strong><span id="demo_span" style="color: white"></span></strong>

		  </div>
		  <div class="navbox">
		    <div class="navbox-tiles">
			    <a href="/project_list/" class="tile">
			        <div class="icon"><i class="fa fa-home"></i></div><span class="title">首页</span>
			    </a>
			    <a href="/admin/" class="tile">
			        <div class="icon"><i class="fa fa-database"></i></div><span class="title">进入后台</span>
			    </a>
			    <a href="/logout/" class="tile">
			        <div class="icon"><i class="fa  fa-sign-out"></i></div><span class="title">退出登陆</span>
			    </a>

		        {% for i in buttons %}
                <a href="{{ i.path }}" class="tile">
			        <div class="icon"><i class="fa  fa-{{ i.icon }}"></i></div><span class="title">{{ i.name }}</span>
			    </a>
                {% endfor %}
		    </div>
		  </div>
	</div>

	

{#    <script src="http://libs.useso.com/js/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>#}
	<script>window.jQuery || document.write('<script src="/static/menu/js/jquery-2.1.1.min.js"><\/script>')</script>
	<script>
	(function () {
	    $(document).ready(function () {
	        $('#navbox-trigger').click(function () {
	            return $('#top-bar').toggleClass('navbox-open');
	        });
	        return $(document).on('click', function (e) {
	            var $target;
	            $target = $(e.target);
	            if (!$target.closest('.navbox').length && !$target.closest('#navbox-trigger').length) {
	                return $('#top-bar').removeClass('navbox-open');
	            }
	        });
	    });
	}.call(this));
	</script>

    <script>
            $.get('/demo_span/',{},function (ret){
                document.getElementById('demo_span').innerText = ret
            })
    </script>
</body>
</html>